HTML DOM Document addEventListener() 方法 |
您所在的位置:网站首页 › js addEventListener方法 › HTML DOM Document addEventListener() 方法 |
w3school 在线教程
HTML 系列教程
浏览器脚本
服务器脚本
编程教程
XML 系列教程
建站手册
参考手册
JS 参考手册
JS 参考手册(类别排序)
JS 参考手册(字母排序)
JavaScript
JS Array
JS Boolean
JS Class
JS Date
JS Error
JS Global
JS JSON
JS Math
JS Number
JS RegExp
JS String
JS 对象
JS 运算符
JS 语句
JS 类型化数组
Window
Window 对象
Window Console
Window History
Window Location
Window Navigator
Window Screen
HTML DOM
HTML Document
HTML Element
HTML Attribute
HTML Event
HTML Event 对象
HTML Collection
HTML NodeList
HTML DOMTokenList
HTML Style
Web API
API Canvas
API Console
API Fetch
API Fullscreen
API Geolocation
API History
API MediaQueryList
API Storage
API Validation
API Web
HTML 对象
-
button
checkbox
color
date
datetime
datetime-local
email
file
hidden
image
month
number
password
radio
range
reset
search
submit
text
time
url
week
其他参考手册 CSSStyleDeclaration JS 类型转换 HTML DOM Document addEventListener() 方法 activeElement adoptNode() HTML DOM Documents 定义和用法 addEventListener() 方法将事件处理程序附加到文档。 实例 例子 1向文档添加 click 事件: document.addEventListener("click", myFunction); function myFunction() { document.getElementById("demo").innerHTML = "Hello World"; }亲自试一试 更简单的语法: document.addEventListener("click", function(){ document.getElementById("demo").innerHTML = "Hello World"; });亲自试一试 例子 2您可以向文档添加多个事件侦听器: document.addEventListener("click", myFunction1); document.addEventListener("click", myFunction2);亲自试一试 例子 3您可以添加不同类型的事件: document.addEventListener("mouseover", myFunction); document.addEventListener("click", someOtherFunction); document.addEventListener("mouseout", someOtherFunction);亲自试一试 例子 4传递参数时,使用“匿名函数”调用带参数的函数: document.addEventListener("click", function() { myFunction(p1, p2); });亲自试一试 例子 5更改文档的背景颜色: document.addEventListener("click", function(){ document.body.style.backgroundColor = "red"; });亲自试一试 例子 6使用 removeEventListener() 方法: // 添加事件监听器 document.addEventListener("mousemove", myFunction); // 移除事件监听器 document.removeEventListener("mousemove", myFunction);亲自试一试 语法 document.addEventListener(type, function, capture) 参数 参数 描述 type必需。事件名称。 请勿使用 "on" 前缀。 请使用 "click" 而不是 "onclick"。 所有 HTML DOM 事件都列在: HTML DOM Event 对象参考手册 function必需。事件发生时运行的函数。 当事件发生时,将事件对象作为第一个参数传递给函数。 事件对象的类型取决于指定的事件。例如,"click" 事件属于 MouseEvent 对象。 capture可选(默认 = false)。 true - 处理程序在捕获阶段执行 false - 处理程序在冒泡阶段执行 返回值无。 技术细节该方法将把指定的事件监听器函数添加到当前节点的监听器集合中,以处理指定类型 type 的事件。如果 capture 为 true,则监听器被注册为捕捉事件监听器。如果 capture 为 false,它被注册为普通事件监听器。 addEventListener() 可能被调用多次,在同一个节点上为同一种类型的事件注册多个事件句柄。但要注意,DOM 不能确定多个事件句柄被调用的顺序。 如果一个事件监听器函数在同一个节点上用相同的 type 和 capture 参数注册了两次,那么第二次注册将被忽略。如果正在处理一个节点上的事件时,在这个节点上注册了一个新的事件监听器,则不会为那个事件调用新的事件监听器。 当用 Node.cloneNode() 方法或 Document.importNode() 方法复制一个 Document 节点时,不会复制为原始节点注册的事件监听器。 这个方法也在 Document 和 Window 对象上定义了,而且工作方式类似。 浏览器支持document.addEventListener 是 DOM Level 2 (2001) 特性。 所有浏览器都完全支持它: Chrome IE Edge Firefox Safari Opera Chrome IE Edge Firefox Safari Opera 支持 9-11 支持 支持 支持 支持 相关页面 元素方法addEventListener() 方法 removeEventListener() 方法 文档方法addEventListener() 方法 removeEventListener() 方法 教程HTML DOM EventListener 完整的 DOM 事件列表 activeElement adoptNode() HTML DOM Documents JavaScript 和 HTML DOM 参考手册 JavaScript 实例 JavaScript 测验 JavaScript 教程W3School 简体中文版提供的内容仅用于培训和测试,不保证内容的正确性。通过使用本站内容随之而来的风险与本站无关。版权所有,保留一切权利。 关于 W3School 帮助 W3School 使用条款 隐私条款 技术支持:赢科 蒙ICP备06004630号 |
今日新闻 |
推荐新闻 |
CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |